<template>
  <div class="container">
    <data-view
      ref="dataView"
      propViewKey="role_crud"
      propViewForm="sys/role/detail.vue"
      :propInitData="selectedTreeNode"
      @extra-button-click="extraButtonClick"
      :propIsTdesign="true"
      class="box-right"
      :propBeforeClick="propBeforeClickDtl"
    />
  </div>
</template>

<script>
import treeOffice from '@/components/custom/bus/treeOffice.vue'

export default {
  remark:'角色管理-列表',
  name: 'role',
  data() {
    return {
      selectedTreeNode: {},
      roleForm: {
        id: "",
        nickname: "",
        rolesId: []
      },
      roleOptions: [],
      defaultRoleValue: []
    }
  },
  created() {
  },

  mounted() {
  },

  components: {
    treeOffice,
  },
  watch: {
  },
  methods: {
    // 加载列表
    loadDtl() {
      let wrapper = this.$newWrapper()
      let id = this.strings.defaultIfBlank(this.selectedTreeNode.id, '0')
      if (id != '0') {
        wrapper.eq('officeId', id)
      }
      this.$refs.dataView.setQueryWrapper(wrapper)
    },
    handleTreeClick(data) {
      this.selectedTreeNode = data
      this.loadDtl()
    },
    extraButtonClick({button, data}) {
      let buttonKey = button.key
      if (buttonKey === 'resetPassword') {
        this.$confirm('此操作将重置用户密码, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$ajax.post(`/upms/users/${data.id}/resetPassword`).then(resp => {
            resp.data.success && this.utilMessage.success(resp.data.msg)
          })
        }).catch(() => {
          this.utilMessage.info('已取消')
        })
      }
      if (buttonKey === 'setRole') { //授权
        this.$set(this.roleForm, 'nickname', data.nickname)
        this.$set(this.roleForm, 'rolesId', data.rolesId)
        this.roleForm.id = data.id
        this.$refs.customDrawerRole.show()
      }
    },
    // 列表按钮点击前操作
    propBeforeClickDtl(button) {
      return true
    },
  }
}
</script>

<style lang="scss" scoped>
.container {
  height: 100%;
  background-color: #fff;
}
.tree-container {
  padding:10px;
  margin-right:20px;
  border:solid 1px #DCDFE6;
  height:100%
}
.tree-filter {
  margin:10px;
  width:80%
}
</style>
